<template>
    <div id="child">
        <div class="box">
            <div>
                <el-text class="mx-1">我是子组件</el-text>
                <h3>{{ num }}</h3>
                <el-button @click="hand" type="success"  round>减少</el-button>
            </div>
        </div>
    </div>
 </template>
 <script setup >
 import three from './three.vue';
 const props = defineProps(['num'])
 const emits = defineEmits(['sub'])
 const hand =()=>{
    emits('sub')
 }
 </script>
 <style scoped lang="scss">
 h3{
    text-align: center;
    font-size: 20px;
 }
  .box{
    width: 200px;
    height: 200px;
    border: 2px solid #E4E7ED;
    display: flex;
    align-items: center;
    justify-content: center;
 }
 </style>